/**
 * BannerImage函数用于渲染一个带有背景图片的横幅图像组件。
 * 该组件通过Redux中的hook来获取网站信息，并将其用作背景图片。
 * 
 * @returns 返回一个React元素。
 */
import React from 'react'
import style from "./BannerImage.module.scss"
import { useAppSelector } from '@/hooks/useReduxHook'

export default function BannerImage():React.ReactElement {
    // 使用Redux hook来选择器获取网站信息
    const webInfo = useAppSelector((state)=>state.webInfo.webInfo)
    
    return (
        // 使用CSS模块和webInfo中的背景图片渲染div元素
        <div
        className={`${style['banner-img']} flex flex--b`}
        style={ {backgroundImage: `url(${webInfo.backgroundImage})`} }
      ></div>
    )
}